﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>接口管理</title>
    <script src="/Apm/js/CMSList.js"></script>
    <style>
        .HeadImage img{
            width:4rem;
            height:4rem;
            border-radius:2rem;
        }
    </style>
</head>
<body>
    <div class="page">
        <div class="toolsbar">
            <button id="Add" class="layui-btn">
                <i class="layui-icon">&#xe654;</i> 添加
            </button>
            <button id="Edit" class="layui-btn layui-btn-normal">
                <i class="layui-icon">&#xe642;</i> 编辑
            </button>
            <button id="Delete" class="layui-btn layui-btn-danger">
                <i class="layui-icon">&#xe640;</i> 删除
            </button>
        </div>
        <div class="content">
            <table id="tabledata" lay-filter="datalist"></table>
        </div>
    </div>
</body>
</html>

<script>

    layui.use(['table', 'layer', 'element'], function () {
        var table = layui.table,
            layer = layui.layer,
            element = layui.element;

        BindData();
        
        //新增
        $("#Add").click(function () {
            
            layer.open({
                title: '接口操作',
                type: 2,
                area: ['600px', '80%'],
                content: '/API/APIEdit.html?type=add',
                end: function () {
                    BindData();
                }
            });
        })
        //编辑
        $("#Edit").click(function () {
            var checkStatus = table.checkStatus('datalist');

            var rows = checkStatus.data.length;
            if (rows > 0) {
                if (rows == 1) {
                    var id = checkStatus.data[0].Guid;

                    layer.open({
                        title: '接口操作',
                        type: 2,
                        area: ['600px', '80%'],
                        content: '/API/APIEdit.html?type=edit&id=' + id,
                        end: function () {
                            BindData();
                        }
                    });
                }
                else {
                    layer.msg("编辑中请不要多选");
                }
            }
            else {
                layer.msg("请选中一行");
            }

        });
        //删除
        $("#Delete").click(function () {
            var checkStatus = table.checkStatus('datalist');

            var rows = checkStatus.data.length;
            if (rows > 0) {
                if (rows == 1) {
                    var id = checkStatus.data[0].Guid;

                    layer.confirm('确定删除？', { icon: 3, title: '删除' }, function (index) {

                        ajaxget({
                            url: 'api/Method/APIDelete?Token=' + MyPublic.getToken() + '&guid=' + id,
                            success: function (data) {
                                data = JSON.parse(data);

                                if (data.code === "10002") {
                                    layer.close(index);
                                    BindData();
                                }
                                else {
                                    layer.msg(data.msg);
                                }
                            }
                        })


                    });
                }
                else {
                    layer.msg("此模块不支持删除多条记录");
                }
            }
            else {
                layer.msg("请选择要删除的记录");
            }
        });

    });
    /**
     * 初始化数据
     */
    function BindData() {
        
        layui.use(['table', 'layer'], function () {
            var table = layui.table,
                layer = layui.layer;

            ajaxget({
                url: 'api/Method/APIGet?Token=' + MyPublic.getToken(),
                success: function (data) {

                    table.render({
                        id: 'datalist',
                        elem: '#tabledata',
                        cols: [[//标题栏
                            { type: 'checkbox' },
                            { field: 'ChinaAPI', title: '接口名称',width:120 },
                            { field: 'EnglishAPI', title: '英文名称', width: 120 },
                            { field: 'Remark', title: '说明'}
                        ]],
                        data: data,
                        height: 'full-68',
                        limit: 20,
                        limits: [20, 40, 60],
                        page: true
                    })
                }
            })

        });
    }
</script>